<template>
  <div class="cart">
    <CartTitle></CartTitle>
    <div class="center">
      <CartTable @childFn="getCart"></CartTable>
      <CartRight :message="datas" :key="0" class="right"></CartRight>
    </div>
    <Footer></Footer>
  </div>
</template>

<script>
import CartTitle from "@/components/CartTitle.vue";
import CartTable from "@/components/CartTable.vue";
import CartRight from "@/components/CartRight.vue";
import Footer from "@/components/Footer.vue";
export default {
  name: "Cart",
  components: {
    CartTitle,
    CartTable,
    CartRight,
    Footer,
  },
  data() {
    return {
      datas: [],
    };
  },
  methods: {
    getCart(results) {
      this.datas = results
    }
  },
};
</script>

<style>
.center {
  display: flex;
  justify-content: space-around;
}
</style>